<template>
	<!--综合税费申报-->
	<view class="yhsfsb">
		<view class="title">
			<text>申报详情</text>
		</view>
		<view class="sbLists">
			<uni-group class="dqjItem">
				<view class="sbtitle">
					<view>出租屋地址：{{tdsbData.address}}</view>
				</view>
				<view v-if="zlJqJudge">
					<view class="item">
						<view class="name">申报类型</view>
						<view class="con">城镇土地使用税申报</view>
					</view>
					<view class="item">
						<view class="name">房源编号</view>
						<view class="con">{{tdsbData.houseCode}}</view>
					</view>
					<view class="item">
						<view class="name">纳税人识别号</view>
						<view class="con">{{tdsbData.shxydm}}</view>
					</view>
					<view class="item">
						<view class="name">纳税人名称</view>
						<view class="con">{{tdsbData.nsrmc}}</view>
					</view>
					<view class="item">
						<view class="name">房屋类别</view>
						<view class="con">
							<text>{{tdsbData.fwlb}}</text>
						</view>
					</view>
					<view class="item">
						<view class="name">土地占用面积</view>
						<view class="con">{{tdsbData.taxArea}}</view>
					</view>
					<view class="item">
						<view class="name">不动产取得时间</view>
						<view class="con">{{tdsbData.houseGainTime}}</view>
					</view>
					<view class="item">
						<view class="name  hj">不动产转出时间</view>
						<view class="con"><text>{{tdsbData.houseRolloffTime?tdsbData.houseRolloffTime:"-"}}</text></view>
					</view>
					<view class="item">
						<view class="name  hj">税款所属期</view>
						<view class="con">
							<text v-if="tdsbData.skssqq">{{tdsbData.skssqq+"至"+tdsbData.skssqz}}</text>
						</view>
					</view>
					<view class="item">
						<view class="name  hj">申报时间</view>
						<view class="con">
							<text>{{tdsbData.sbsj}}</text>
						</view>
					</view>
					<view class="item">
						<view class="name  hj">缴款状态</view>
						<view class="con">{{tdsbData.jkzt}}</view>
					</view>
				</view>
			</uni-group>
		</view>
		<view class="zlzkorxs">
			<view class="zlxxZs" v-show="!zlJqJudge" @click="bindZs">
				<view>租赁详情展开</view>
				<uni-icons custom-prefix="custom-icon" type="bottom" size="30" class="cg"></uni-icons>
			</view>
			<view class="zlxxZs" v-show="zlJqJudge" @click="bindZs">
				<view>租赁详情收起</view>
				<uni-icons custom-prefix="custom-icon" type="top" size="30" class="cg"></uni-icons>
			</view>
		</view>
		<view class="gdc"></view>
		<view class="sesj">
			<view class="sesj">
				<view class="seTitle">
					<view class="lsbt"></view>
					<text>申报明细</text>
				</view>
			</view>
		</view>
		<view class="sesj">
			<view class="seTitle">
				<text>一、计税依据</text>
			</view>
			<view class="seItem">
				<view>
					<view class="itemTitle">
						计税依据（元）
					</view>
				</view>
				<view class="itemMny">{{czwSbMxDTOList.jsyj}}</view>
			</view>
		</view>
		<view class="sesj">
			<view class="seTitle">
				<text>二、单价</text>
			</view>
			<view class="seItem">
				<view>
					<view class="itemTitle">
						单价（元）
					</view>
				</view>
				<view class="itemMny">{{czwSbMxDTOList.sl}}</view>
			</view>
		</view>
		<view class="sesj">
			<view class="seTitle">
				<text>三、减免税额</text>
			</view>
			<view class="seItem">
				<view>
					<view class="itemTitle">
						减免税额（元）
					</view>
				</view>
				<view class="itemMny">{{Math.round(Number(czwSbMxDTOList.jmse+czwSbMxDTOList.phjmse)*100)/100}}</view>
			</view>
		</view>
		<view class="sesj">
			<view class="seTitle">
				<text>四、已缴税额</text>
			</view>
			<view class="seItem">
				<view>
					<view class="itemTitle">
						已缴税额（元）
					</view>
				</view>
				<view class="itemMny">{{czwSbMxDTOList.yjse}}</view>
			</view>
		</view>
		<view class="gdc"></view>
		<view class="sesj">
			<view class="seTitle">
				<view class="lsbt"></view>
				<text>应补（退）税额</text>
			</view>
			<view class="seItem">
				<view>
					<view class="itemTitle">
						应补（退）税额（元）
					</view>
				</view>
				<view class="itemMny">{{tdsbData.ybtse}}</view>
			</view>
		</view>
		<view class="sbBtn btn">
			<button type="primary" size="mini" @click="goBack">关闭</button>
		</view>
	</view>
</template>

<script>
	import {
		ystFsSbxxDetailById
	} from "@/utils/common-api.js"
	export default {
		data() {
			return {
				tdsbData: "",
				czwSbMxDTOList: [],
				jsseData: "",
				sbId: "", //申报id
				zlJqJudge: true
			}
		},
		onLoad(e) {
			// console.log(e) 
			// this.yhssbForm = JSON.parse(e.yhssbForm)
			this.handleSearch(e.sbId)
		},
		methods: {
			async handleSearch(val) {
				let res = await ystFsSbxxDetailById({
					// id: "c4a5c233aeb443f3bb8379f92190e1b9"
					id:val
				})
				if (res.body && res.head.errorCode == "0") {
					console.log(res)
					this.tdsbData = res.body
					this.czwSbMxDTOList = res.body.czwSbMxDTOList[0]
					this.jsseData = res.body
				} else if (res.head.errorCode != "0") {
					uni.showToast({
						title: '数据请求失败',
						icon: 'error',
						duration: 3000
					})
				}
			},
			// 点击展开或收起
			bindZs() {
				if (this.zlJqJudge) {
					this.zlJqJudge = false
				} else {
					this.zlJqJudge = true
				}

			},
			// 返回修改
			goBack() {
				uni.navigateBack();
			}
		}
	}
</script>

<style>
	.yhsfsb {}

	.title {
		width: 100%;
		height: 80rpx;
		background: #3171d5;
		text-align: center;
		line-height: 80rpx;
		color: white;
	}

	.sbLists {
		box-sizing: border-box;
		width: 100%;
		font-weight: bold;
		font-size: 26rpx;
	}

	.dqjItem {
		background: #ffffff;
		border: 2rpx solid #e7e7e7;
	}

	.sbtitle {
		padding: 0 20rpx;
		border-bottom: 5rpx solid #3171d5;
		color: #3171d5;
		height: 80rpx;
		line-height: 80rpx;
	}

	.sbLists .qjk {
		margin-right: 20rpx;
	}

	::v-deep .uni-group .uni-group__content {
		padding: 0;
	}

	.uni-group__content {
		padding: 0;
	}

	.sbLists .item {
		height: 80rpx;
		line-height: 80rpx;
		display: flex;
		border-bottom: 2rpx solid #66666640;
	}

	.sbLists .item:last-child {
		border-bottom: 0rpx solid #66666640;
	}

	.sbLists .item .name {
		width: 190rpx;
		color: #66666699;
		text-align: left;
		margin-right: 10rpx;
		padding-left: 20rpx;

	}

	.sbLists .item .con {
		color: #222222;
		text-align: left;
	}

	.sbLists .item .hj {
		color: #222222;
	}

	.zlform {
		background: #ffffff;
		padding: 20rpx;
	}

	.btn {
		text-align: center;
	}

	.btn uni-button {
		width: 240rpx;
		margin: 0 20rpx;
		height: 70rpx;
		line-height: 70rpx;
	}

	.sesj {
		margin-top: 10rpx;
		background: #ffffff;
	}

	.sesj>.seTitle {
		border-bottom: 2rpx #e5e5e5 solid;
		font-weight: bold;
		font-size: 28rpx;
		position: relative;
		padding: 10rpx 20rpx;
	}

	.seTitle .lsbt {
		position: absolute;
		left: 10rpx;
		top: 50%;
		transform: translateY(-50%);
		width: 8rpx;
		height: 30rpx;
		background: #1198d3;
		border-radius: 4rpx;
	}

	.seItem {
		padding: 20rpx;
		display: flex;
		justify-content: space-between;
		border-bottom: 2rpx #e5e5e5 solid;
	}

	.itemTitle,
	.itemMny {
		font-size: 28rpx;
	}

	.itemMny {
		min-width: 150rpx;
		text-align: center;
		color: red;
		font-weight: bold;
		word-wrap: break-word;
		word-break: break-all;
	}

	.itemTip {
		font-size: 20rpx;
		color: #666666;
	}

	.sbBtn {
		padding: 20rpx;
		background: #ffffff;
	}

	.yhsYjjsyj {
		padding: 20rpx;
		font-size: 20rpx;
		color: black;
		background: #ffffff;
	}

	.yhsYjjsyj span {
		font-size: 30rpx;
		color: #3171d5;
	}

	.zlzkorxs {
		display: flex;
		justify-content: center;
		background: #ffffff;
		padding: 10rpx 0;
	}

	.zlxxZs {
		font-size: 28rpx !important;
		display: flex;
		justify-content: center;
		align-items: center;
		color: #3171d5;
		width: 240rpx;
		border: 2rpx solid #3171d5;
		padding: 5rpx;
		border-radius: 6rpx;
	}

	.uniui-bottom {
		font-size: 28rpx !important;
		color: #3171d5 !important;
		font-weight: bold;
	}

	.uniui-top {
		font-size: 28rpx !important;
		color: #3171d5 !important;
		font-weight: bold;
	}

	.gdc {
		width: 100%;
		height: 20rpx;
		background-color: #f2f2f2;
	}
</style>